<title>Store</title>
<script>
    function loadMap(title, mapLink) {
        $("#myModalLabel").text("Location");
        $("#myModal .modal-body").html("");
        var link = "";
        if (mapLink.match("http")) {
            link = "<iframe width='565' height='350' frameborder='0' scrolling='no' marginheight='0' marginwidth='0' src='" + mapLink + "'></iframe><br />";
        } else {
            link = "<h3>Google Map Location not specified.</h3>";
        }
        $("#myModalLabel").text(title + "\'s location on Google Map");
        $("#myModal .modal-body").html(link);
    }
</script>
<a class="btn btn-success" href="<?= $this->url(array(), 'store-add'); ?>"><i class="icon-white icon-plus-sign"></i> Add New Store</a><br><br>
<!--<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps/ms?msa=0&amp;msid=208154092907302378567.0004e2e7a710883aa1688&amp;ie=UTF8&amp;t=h&amp;ll=22.270641,70.761867&amp;spn=0.003475,0.00456&amp;z=17&amp;iwloc=0004e2e7a7ef1974f3949&amp;output=embed"></iframe><br />-->
<div id="view-content">
    <div class="row-fluid">
        <div>
            <table class="table">                
                <?php
                $index = 1;
                foreach ($this->allStores as $store) :
                    ?>
                    <tr class="well">
                        <td><h1><?= $index ?></h1></td>
                        <td>
                            <div class="span4">
                                <address>
                                    <h4><?= $store['store_name'] ?></h4>
                                    <?= $store['address1'] ?> <?= $store['address2'] ?><br>
                                    <?= $store['location']['zipcode']['code'] ?>,
                                    <?= $store['location']['city']['name'] ?>,
                                    <?= $store['location']['state']['name'] ?>
                                </address>
                            </div>
                            <div class="span4">
                                <b>Email: </b> <?= $store['email'] ?><br>
                                <b>Contact: </b> <?= $store['contact1'] ?>, <?= $store['contact2'] ?><br><br>                                
                            </div>
                            <div class="span2">
                                Selected Brands:
                                <ol>
                                    <?php
                                    foreach ($store['brands'] as $brand) {
                                        echo "<li>".$brand['brand_name'] . "</li>";
                                    }
                                    ?> 
                                </ol>

                            </div>
                            <div class="span2">
                                <a class="btn" title="Edit store details" href="<?= $this->url(array('id' => $store['store_id']), 'store-update'); ?>" ><i class="icon-edit"></i></a>                                
                                <a id="loadmap" onclick="loadMap('<?= $store['store_name'] ?>', '<?= $store['map'] ?>');" class="btn" title="View location on map" href="#myModal" role="button" data-toggle="modal"><i class="icon-map-marker"></i></a>
                                <?php if ($store['store_enabled']): ?>
                                    <a class="btn" title="Disable this store" href="<?= $this->url(array('id' => $store['store_id'], 'key' => 'disable'), 'store-state-change'); ?>"><i class="icon-ban-circle"></i></a>
                                <?php else:
                                    ?>
                                    <a class="btn" title="Enable this store" href="<?= $this->url(array('id' => $store['store_id'], 'key' => 'enable'), 'store-state-change'); ?>"><i class="icon-ok-sign"></i></a>
                                <?php endif;
                                ?>                                                                
                            </div>
                        </td>
                    </tr>
                    <?php
                    $index++;
                endforeach;
                ?>
            </table>
        </div>
    </div>
</div>

<div id="myModal" class="modal hide fade" style="width: 600px;" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h3 id="myModalLabel">Location</h3>
    </div>
    <div class="modal-body">
    </div>    
</div>